<!--
 * @Author: boyyang
 * @Date: 2022-01-09 15:28:39
 * @LastEditTime: 2022-02-05 22:23:17
 * @LastEditors: boyyang
 * @Description: 
 * @FilePath: \boyyang\src\components\modalBox\modalBoxBtn.vue
-->

<template>
    <div class="btn-wrapper">
        <div class="btn" @click="submit">修改</div>
    </div>
</template>

<script lang="ts" setup>
export interface IModalBoxBtnProps {
    text?: string;
}

interface IModalBoxBtnEmits {
    (e: 'btnClick'): void
}

const props = withDefaults(defineProps<IModalBoxBtnProps>(), {
    text: '修改'
})

const emits = defineEmits<IModalBoxBtnEmits>()


const submit = () => {
    emits('btnClick')
}

</script>

<style scoped lang="scss">
.btn-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;

    .btn {
        width: 125px;
        height: 40px;
        border-radius: 8px;
        background-color: rgb(255, 255, 255);

        display: flex;
        justify-content: center;
        align-items: center;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        font-size: 15px;
        font-weight: 600;

        cursor: pointer;
    }
}
</style>
